<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, minimum-scale=0.1">
    <link rel="stylesheet" href="./css/style.css">
    <title>安装使用手册</title>
    <script src="./js/jquery.min.js"></script>
    <script src="./js/showdown.min.js"></script>
    <script>
      $(function(){
        $.ajax({url: './index.md', success: function(mdStr) {
          var converter = new showdown.Converter();
          //将获取到的markdown字符串渲染为html字符串
          $('#content').html(converter.makeHtml(mdStr));
          init()
        }})
        function init() {
          var plus = '<svg t="1593182638819" class="icon plus" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7831" width="512" height="512"><path d="M675.04 483.264l-127.04 0 0-127.264c0-20.064-16.288-36.32-36.32-36.32-20.064 0-36.32 16.192-36.32 36.32l0 127.232-127.072 0c-20.064 0-36.352 16.32-36.352 36.352 0 20.064 16.224 36.352 36.352 36.352l127.072 0 0 127.232c0 20 16.256 36.384 36.32 36.384 20.032 0 36.32-16.256 36.32-36.384l0-127.136 127.04 0c19.968 0 36.352-16.256 36.352-36.384C711.36 499.552 695.136 483.264 675.04 483.264L675.04 483.264zM511.328 65.44c-250.24 0-453.952 203.616-453.952 453.952 0 250.336 203.712 453.952 453.952 453.952 250.336 0 453.984-203.584 453.984-453.952C965.312 269.056 761.696 65.44 511.328 65.44L511.328 65.44zM511.328 916.576c-219.04 0-397.184-178.176-397.184-397.152 0-219.104 178.144-397.216 397.184-397.216s397.216 178.112 397.216 397.216C908.576 738.368 730.368 916.576 511.328 916.576L511.328 916.576zM511.328 916.576" p-id="7832"></path></svg>';
          var reduce = '<svg class="icon reduce" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4154" width="512" height="512"><path d="M512 64C264.58 64 64 264.58 64 512s200.58 448 448 448 448-200.58 448-448S759.42 64 512 64z m0 832c-211.74 0-384-172.26-384-384s172.26-384 384-384 384 172.26 384 384-172.26 384-384 384z" p-id="4155"></path><path d="M704 480H320a32 32 0 0 0 0 64h384a32 32 0 0 0 0-64z" p-id="4156"></path></svg>';
          $('h2').prepend(plus+reduce);
          $('#content').children().not('h2, hr').hide().addClass('ml');
          $('#content').show();
          handleClick();
        }
        // 绑定点击事件
        function handleClick(){
          $('h2').click(function(e){
            var el = $(e.target);
            if(e.target.tagName != 'h2') el = el.parents('h2');
            // 控制同一时间只展开一个 begin
            if(el.find('.reduce').is(":hidden")){
              $('#content').children().not('h2, hr').hide();
              $('#content').children('h2').not(el).find('.reduce').hide();
              $('#content').children('h2').not(el).find('.plus').show();
            }
            // 控制同一时间只展开一个 end
            el.nextUntil('hr').toggle();
            el.find('svg').toggle();
          })
        }
      })
    </script>
  </head>
  <body style="margin: 0px; background: #fff;">
    <div id="content" style="display: none;"></div>
  </body>
</html>